import React, { useState } from "react";
import { Style, Input, Button } from "./loginstyles.js";

const Login = () => {
  const [email, setEmail] = useState("");
  const [password, setPassword] = useState("");

  const handleSubmit = (e) => {
    e.preventDefault();
    console.log('login', email, password);
  };

  return (
    <Style>
      <div className="loginBox">
        <h2>登录</h2>
        <form onSubmit={handleSubmit}>
          <label htmlFor="email">邮箱：</label>
          <Input
            type="email"
            id="email"
            value={email}
            onChange={(e) => setEmail(e.target.value)}
            required
          />
          
          <label htmlFor="password">密码：</label>
          <Input
            type="password"
            id="password"
            value={password}
            onChange={(e) => setPassword(e.target.value)}
            required
          />
          
          <Button type="submit">登录</Button>
        </form>
      </div>
    </Style>
  )
}

export default Login;